<template>
  <div class="">
    <el-dialog class="m_dialog" title="详情" :visible.sync="dialogVisible" width="800" append-to-body :before-close="cancel" :close-on-click-modal="false">
      <div class="content">
        <CustomTitle title="基本信息"></CustomTitle>
        <BaseDescriptions :descConfig="descConfig" :descConfigItem="descConfigItem" :descModel="descModel">
          <template #status>
            <dict-tag :options="dictMap.type.sys_common_status" :value="descModel.status" />
          </template>
        </BaseDescriptions>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { mapState } from 'vuex';
import BaseDescriptions from '@/components/PageContent/BaseDescriptions.vue';
export default {
  name: 'operationDetail',
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
    titleIndex: {
      type: Number | String,
      default: 0,
    },
    descData: {
      type: Object,
      default: () => {},
    },
    dictMap: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      descConfig: {
        size: 'medium',
        column: '2',
      },
      descModel: {
        infoId: '',
        userName: '',
        ipaddr: '',
        status: '',
        accessTime: '',
      },
      descConfigItem: [
        {
          fieIdName: 'infoId',
          label: '访问编号',
          span: 2,
        },
        {
          fieIdName: 'userName',
          label: '用户名称',
          span: 2,
        },
        {
          fieIdName: 'ipaddr',
          label: '登录地址',
          span: 2,
        },
        {
          fieIdName: 'status',
          label: '登录状态',
          span: 2,
          slotName: 'status',
        },
        {
          fieIdName: 'msg',
          label: '描述',
          span: 2,
        },
        {
          fieIdName: 'accessTime',
          label: '访问时间',
          span: 2,
        },
      ],
    };
  },
  computed: {
    ...mapState('dialog', ['dialogTitles']),
  },
  watch: {
    descData: {
      deep: true,
      immediate: true,
      handler() {
        this.descModel = JSON.parse(JSON.stringify(this.descData));
      },
    },
  },
  created() {},
  mounted() {},
  methods: {
    cancel() {
      this.$emit('cancel');
    },
  },
  components: {
    BaseDescriptions,
  },
};
</script>

<style lang="less" scoped></style>
